<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		
		.box {
			height: 100px;
			background-color: pink;
		}

		.one {
			width: 100px;
			height: 100px;
			background-color: red;
			margin: 0 auto;
		}

		.box:hover .one {
			
			 /* 2d转换位移： 改变元素位置 */
			 /* transform: translate(100px,100px); */
			
			 /* 设置的是倍数 */
			 /* transform: scale(0.5,1); */

			 /* transform: rotate(60deg); */

			 /* transform: skew(30deg,30deg); */
		}
	</style>
</head>
<body>
	
	 <div class="box">
	 	
	 	 <div class="one">asdfafd</div>
	 </div>
</body>
</html>